<template>
  <view class="guessYouLike_component">
    <!-- 猜你喜欢 -->
    <!-- <view>
      <view class="recommend"> <span>精选推荐</span> </view>
    </view> -->
	<!-- <slot></slot> -->
    <view class="YouLike">
      <view class="like_item">
        <view class="item">
          <!-- <image src="../../static/czimg/898@3x.png" mode="" /> -->
		  <image src="" mode=""></image>
          <view class="goods_detail">
            <span class="jingpin">精品推荐</span>
            纽曼能浪蓝牙补录突击5.5阿双方均是大法官问看阿达
          </view>
          <view class="goods_price">
            <span class="newPrice">999</span>
            <span class="oldPrice">888</span>
          </view>
          <view class="goods_sales">
            <span> 月销 </span>
            <span>
              <!-- <image src="" mode="" /> -->
			  <image src="" mode=""></image>
            </span>
          </view>
        </view>
      </view>
      <view class="like_item">
        <view class="item">
          <!-- <image src="/car@3x.png" mode="" /> -->
		  <image src="" mode=""></image>
          <view class="goods_detail">
            <span class="jingpin">精品推荐</span>
            纽曼能浪蓝牙补录突击5.5阿双方均是大法官问看阿达
          </view>
          <view class="goods_price">
            <span class="newPrice">
              <span style="font-size: 20rpx">¥</span> 999
              <span style="font-size: 20rpx">.00</span>
            </span>
            <span class="oldPrice">888</span>
          </view>
          <view class="goods_sales">
            <span style=""> 月销 </span>
            <span>
              <!-- <image src="" mode="" /> -->
			  <image src="" mode=""></image>
            </span>
          </view>
        </view>
      </view>
      <view class="like_item">
        <view class="item">
          <!-- <image src="" mode="" /> -->
		  <image src="" mode=""></image>
          <view class="goods_detail">
            <span class="jingpin">精品推荐</span>
            纽曼能浪蓝牙补录突击5.5阿双方均是大法官问看阿达
          </view>
          <view class="goods_price">
            <span class="newPrice">999</span>
            <span class="oldPrice">888</span>
          </view>
          <view class="goods_sales">
            <span> 月销 </span>
            <span>
              <!-- <image src="" mode="" /> -->
			  <image src="" mode=""></image>
            </span>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {};
  },
};
</script>

<style scoped>
.jingpin {
  border-radius: 8rpx;
  background-color: #f5bb78;
  color: white;
}
.goods_price,
.goods_sales {
  display: flex;
  justify-content: space-between;
}
.goods_detail {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
span image {
  width: 16rpx;
  height: 16rpx;
}
.item view {
  margin-top: 12rpx;
}
.like_item {
  width: 45vw;
  border-bottom: 1px solid #fafafa;
  border-right: 1px solid #fafafa;
  height: 500rpx;
  background-color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
}
.item {
  width: 274rpx;
  height: 400rpx;
}
image {
  width: 274rpx;
  height: 214rpx;
  background-color: red;
}
.guessYouLike_component {
  width: 690rpx;
  /* min-height: 50vh; */
  margin: 0 auto;
  /* background-color: green; */
  box-sizing: border-box;
  /* padding-right: 30rpx; */
}
.recommend span {
  margin-left: 12rpx;
  font-size: 40rpx;
  font-weight: bold;
}
.recommend {
  height: 34rpx;
  line-height: 34rpx;

  border-left: 8rpx solid #ff4d53;
}
.newPrice {
  font-size: 35rpx;
  color: #ff0000;
}
.oldPrice {
  text-decoration: line-through;
  font-size: 20rpx;
  color: #999999;
}
.YouLike {
  margin-top: 20rpx;
  width: 690rpx;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
.goods_sales span {
  font-size: 20rpx;
  color: #999999;
}
</style>

